/*
 * 账号总览搜索框
 * @Author: ljb
 * @Date: 2019-03-15 10:55:17
 * @Last Modified by: ljb
 * @Last Modified time: 2019-03-15 18:03:57
 */
<template>
	<Form
		ref="formInline"
		inline
		@keydown.native.enter.prevent="confirmSearch">

		<Form-item
			:label-width="labelWidth(80, 120)"
			:label="$t('device.account')">
			<i-input
				v-model="formValidate.account_keyword"
				:placeholder="$t('common.placeholder',{'field':$t('device.account')})"
				name="search-account_keyword"
				type="text"/>
		</Form-item>

		<Form-item
			:label-width="labelWidth(80, 120)"
			:label="$t('device.store')">
			<Select
				v-model="formValidate.store_id"
				filterable
				clearable>
				<Option
					v-for="store in stores"
					:value="String(store.id)"
					:key="store.id">{{ store.name }}</Option>
			</Select>
		</Form-item>

		<Form-item
			:label-width="labelWidth(80, 120)"
			:label="$t('device.customer')">
			<Select
				v-model="formValidate.customer_id"
				filterable
				clearable>
				<Option
					v-for="customer in customers"
					:value="String(customer.id)"
					:key="customer.id">{{ customer.name }}</Option>
			</Select>
		</Form-item>

		<Form-item
			:label-width="labelWidth(80, 120)"
			:label="$t('device.account_status')">
			<Select
				v-model="formValidate.enabled"
				:style="{width: '100px'}"
				clearable>
				<Option
					v-for="status in account_status"
					:value="status.value"
					:key="status.value">{{ status.label }}</Option>
			</Select>
		</Form-item>

		<Form-item>
			<Button
				type="primary"
				@click="confirmSearch">
				{{ $t('common.search') }}
			</Button>
		</Form-item>

	</Form>
</template>
<script>

import labelWidthMixin from 'src/views/mixins/labelWidthMixin';

export default {

	name: 'AccountSearchForm',

	mixins: [labelWidthMixin],

	props: {
		customers: {
			type: Array,
			default() {
				return [];
			},
		},
		stores: {
			type: Array,
			default() {
				return [];
			},
		},
	},

	data() {
		return {
			account_status: [ // 账号状态
				{
					label: this.$t('device.enable'),
					value: '1',
				},
				{
					label: this.$t('device.disable'),
					value: '0',
				},
			],
			formValidate: {

				account_keyword: '',	// 账号关键字

				store_id: '',		// 店铺关键字

				customer_id: '',	// 商家关键字

				enabled: '',			// 账号状态

			}, // 搜索框的对象参数
		};
	},

	mounted() {

	},

	methods: {

		/**
         * 确认搜索
         */
		confirmSearch() {
			const param = {

				account_keyword: this.formValidate.account_keyword,

				store_id: this.formValidate.store_id,

				customer_id: this.formValidate.customer_id,

				enabled: this.formValidate.enabled,

			};

			this.$emit('search', param);
		},

	},

};

</script>
